.waterfall {
  column-gap: 0;

  .item {
    box-sizing: border-box;
    break-inside: avoid;
    padding: 10px;

    .item-content {
      display: flex;
      flex-direction: column;
      padding: 10px;
      height: auto;
      font-size: 1rem;
      color: #686868;
      box-sizing: border-box;
      border: 1px solid #ccc;
      border-radius: 5px;
      box-shadow: 2px 2px 5px 2px skyblue;
      transition: all .3s;
      cursor: pointer;

      &:hover {
        transform: translate(1px, 1px);
      }


      img {
        padding: 10px;
        width: 100%;
      }

      h3 {
        overflow: hidden;
        width: 100%;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: tomato;
        font-size: 1rem;
        margin-bottom: 5px;
      }

      .icon-area {
        span {
          font-size: 1rem;
          margin: 10px 0;
          color: #ccc;
        }
      }

      article {
        text-indent: 2em;
        font-size: .7rem;
        margin: 10px 0;
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
      }
    }
  }
}
